import { useDispatch, useSelector } from "react-redux";
import { RootState, AppDispatch } from '@/store';
import { add, add2 } from '@/store/ModuleStatus';
import { sarrPush } from '@/store/ArrStatus';
const View = () => {
  const dispatch = useDispatch<AppDispatch>();

  // 获取仓库数据
  const num = useSelector((state: RootState) => state.handleMoudle.num);

  // 修改仓库数据
  const changeNum = () => {
    dispatch(add2(10));
  };

  // 异步修改数据
  const changeNumAsync = () => {
    setTimeout(() => {
        dispatch(add(5))
    }, 1000);
  };

  const sarr = useSelector((state: RootState) => state.handleArr.sarr);

  const changeArr = () => {
    dispatch(sarrPush(100));
  };

  return (
    <div className="user">
      <p>这是page1组件</p>
      <p>{num}</p>
      <button onClick={changeNum}>同步按钮num</button>
      <button onClick={changeNumAsync}>异步按钮num</button>
      <button onClick={changeArr}>按钮arr</button>
      <p>{sarr}</p>
    </div>
  );
};

export default View;
